html,
body {
  padding: 0;
  margin: 0;
  font-family: -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Oxygen,
    Ubuntu, Cantarell, Fira Sans, Droid Sans, Helvetica Neue, sans-serif;
}

[id] {
/* adding this to container doesn't take effect, why? @TODO */
/* main { */
  /* prevent top menu bar to cover the content */
  scroll-margin-top: 70px;
}
/* another solution, use sudo element
* not so good
* https://stackoverflow.com/questions/10732690/offsetting-an-html-anchor-to-adjust-for-fixed-header
[id]:target::before {
  content: '';
  display: block;
  position: relative;
  width: 0;
  height: 10px;
  margin-top: -60px;
  margin-bottom: 60px;
  visibility: hidden;
} */
